<template>
  <div class="search flex-start">
    <div class="date">
      <label for="">文档类型</label
      ><input class="searchInput w_289" type="text" placeholder="请输入文档名称" v-model="fileName" />
    </div>
    <div class="type">
      <label for="">邮箱</label
      ><input class="searchInput" type="text" placeholder="请输入邮箱号" v-model="userPhone" />
    </div>
    <div class="email">
      <label for="">上传日期</label>
        <el-date-picker
          v-model="fileTime"
          type="date"
          :clearable="false"
          placeholder="请选择日期"
          :format="'yyyy-MM-dd HH:mm:ss'"

        >
        </el-date-picker>
    </div>
    <div class="btnbox flex-start">
        <div class="btn-white2 cp" @click="reset">重置</div>
        <div class="btn-blue2 cp" @click="search">查询</div>
    </div>
  </div>
</template>

<script>
import Time from '@/utils/tools/getUTCTime'

export default {
  data () {
    return {
      fileName: this.$store.state.fileManage.params.fileName,
      fileTime: this.$store.state.fileManage.params.fileTime,
      userPhone: this.$store.state.fileManage.params.userPhone
    }
  },
  methods: {
    search () {
      // console.log(Time.getTime(this.fileTime))
      this.$store.commit('fileManage/set_page', 1)
      this.$store.commit('fileManage/set_size', 10)
      this.$store.commit('fileManage/set_fileName', this.fileName ? this.fileName.trim() : null)
      this.$store.commit('fileManage/set_fileTime', this.fileTime ? Time.getTime(this.fileTime) : null)
      this.$store.commit('fileManage/set_userPhone', this.userPhone ? this.userPhone.trim() : null)
      this.$store.dispatch('fileManage/getTableData').then(res => {
        // console.log(res.data)
      }).catch(err => {
        this.$message({
          type: 'error',
          message: err,
          duration: 1000
        })
      })
    },
    reset () {
      this.fileName = null
      this.fileTime = null
      this.userPhone = null
    }

  }
}

</script>

<style lang="scss" scoped>
.search {

  width: 100%;
  height: 80px;
  background-color: #fff;
  margin-top: 20px;
  position: relative;
  font-size: 14px;
  color: #3d4966;
  border-radius: 8px;
  div {
    label {
      margin-right: 12px;
    }

  }
  .date {
   margin-left: 36px;
   .w_289{
       width: 289px;
   }
  }
  .type {
   margin-left: 20px;
  }
  .email {
   margin-left: 20px;
  }
.btnbox{
    height: 100%;

    position: absolute;
    right: 24px;
    .btn-white2{
        margin-right: 20px;
    }
}
}
</style>
